﻿<!DOCTYPE html>
<html>

<head id="Head1" runat="server">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>订单完成情况看板</title>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
  <link rel="Shortcut Icon" href="../images/aecc.ico" type="image/x-icon" />
  <link href="../StaticFiles/layui/dist/css/layui.css" rel="stylesheet" type="text/css" />
  <script type="text/javascript" src="../Scripts/json2.js"></script>
  <script type="text/javascript" src="../Scripts/jquery-1.11.2.min.js"></script>
  <style type="text/css">
    #header-title {
      height: 60px;
      line-height: 60px;
      text-align: center;
      font-size: 22px;
      font-weight: bold;
    }

    #currentTime {
      height: 60px;
      line-height: 60px;
      text-align: right;
      font-size: 16px;
      font-weight: bold;
    }

    .layui-form-item {
      margin-top: 5px;
      margin-bottom: 5px;
    }

    .layui-form-label {
      padding: 9px 5px;
      width: 100px;
    }

    .layui-form-item,
    .layui-inline {
      margin-bottom: 5px;
      margin-right: 0px !important;
    }

    .layui-form-item .layui-input-inline {
      margin-right: 0px !important;
    }

    .layui-card-header {
      border: none;
      text-align: center;
      font-size: 20px;
      font-weight: bold;
      letter-spacing: 0.1em;
    }

    .layui-laypage,
    .layui-table {
      margin: 0px;
    }

    .lable {
      display: inline-block;
      margin: 5px;
      padding: 3px;
      height: 20px;
      width: 80px;
      text-align: center;
    }

    #content1 td,
    #content1 th {
      text-align: center;
      width: 120px;
      padding: 7px 0px;
      font-size: 12px;
      color: #000;
    }

    .layui-layer-loading .layui-layer-content {
      text-align: center;
      padding-left: 8px;
      padding-top: 65px;
      color: #fff;
    }
  </style>
</head>

<body>
  <!--[if lt IE 9]>
        <script src="../Scripts/pollyfills/es5-shim.min.js"></script>
        <script src="../Scripts/pollyfills/es5-sham.min.js"></script>
        <script src="../Scripts/pollyfills/html5.js"></script>
        <script src="../Scripts/pollyfills/response.js"></script>
    <![endif]-->
  <div class="layui-row layui-bg-green" style="padding: 5px;" id="header">
    <div class="layui-col-md3">
      <div>
        <img src="../images/aeec_logo.png" alt="" height="60" />
      </div>
    </div>
    <div class="layui-col-md6" id="header-title">
      订单完成情况看板
    </div>
    <div class="layui-col-md3" id="currentTime">
    </div>
  </div>
  <form class="layui-form" action="">
    <div class="layui-form-item" style="margin-bottom: 0px;">
      <div class="layui-inline">
        <label class="layui-form-label">
          <img src="../images/过滤.png" height="14px;" alt="" />
          主制分厂：
        </label>
        <div class="layui-input-inline">
          <select name="ddlFactory" lay-verify="required" lay-search="" id="ddlFactory" lay-filter="ddlFactory">
            <option value="0004e2800000001c">机匣分厂</option>
            <option value="0004e28000000dc0">燃烧部件事业部</option>
            <option value="0004e28000000dc6">结构件制造分厂</option>
            <option value="0004e28000002582">盘轴制造分厂</option>
            <option value="0004e28000002828">压气机叶片事业部</option>
          </select>
        </div>
      </div>
      <div class="layui-inline">
        <label class="layui-form-label">
          <img src="../images/过滤.png" height="14px;" alt="" />
          订单号：
        </label>
        <div class="layui-input-inline" style="width: 140px;">
          <input id="txtMfgordername" type="text" name="txtMfgordername" class="layui-input" />
        </div>
      </div>
      <div class="layui-inline">
        <label class="layui-form-label">
          <img src="../images/过滤.png" height="14px;" alt="" />
          零件图号：
        </label>
        <div class="layui-input-inline" style="width: 140px;">
          <input id="txtProductname" type="text" name="txtProductname" class="layui-input" />
        </div>
      </div>
      <div class="layui-inline">
        <label class="layui-form-label">
          <img src="../images/过滤.png" height="14px;" alt="" />
          流水卡号：
        </label>
        <div class="layui-input-inline" style="width: 140px;">
          <input id="txtContainername" type="text" name="txtContainername" class="layui-input" />
        </div>
      </div>
      <div class="layui-inline">
        <label class="layui-form-label">
          <img src="../images/过滤.png" height="14px;" alt="" />
          件号类型：
        </label>
        <div class="layui-input-inline" style="width: 140px;">
          <select name="ddlType" lay-verify="required" id="ddlType">
            <option value="重点件号">重点件号</option>
            <option value="非重点件">非重点件</option>
            <option value="全部">全部</option>
          </select>
        </div>
      </div>
      <div class="layui-inline" style="margin-left: 0px;">
        <button type="button" class="layui-btn layui-btn-sm" id="btnSearch">
          <i class="layui-icon" style="font-weight: bold;">&#xe615;</i>查询
        </button>
        <button type="button" class="layui-btn layui-btn-sm" id="btnReset">
          <i class="layui-icon" style="font-weight: bold;">&#xe9aa;</i>重置
        </button>
      </div>
    </div>
    <div class="layui-form-item" style="margin: 0px;">
      <div class="layui-inline">
        <label class="layui-form-label">
          <img src="../images/过滤.png" height="14px;" alt="" />
          订单状态：
        </label>
        <div class="layui-input-inline" style="width: 140px;">
          <select name="status" lay-verify="required" id="status">
            <option value="全部">全部</option>
            <option value="未开卡">未开卡</option>
            <option value="已开卡未到料">已开卡未到料</option>
            <option value="已到料未完成">已到料未完成</option>
            <option value="已完成">已完成</option>
          </select>
        </div>
      </div>
      <div class="layui-inline">
        <label class="layui-form-label">
          <img src="../images/日历.png" height="14" alt="" />
          计划完成：
        </label>
        <div class="layui-input-inline" style="width: 140px;">
          <input id="txtStartDate" type="text" name="txtStartDate" class="layui-input" />
        </div>
      </div>
      <div class="layui-inline">
        <label class="layui-form-label">
          <img src="../images/日历.png" height="14" alt="" />
          至：
        </label>
        <div class="layui-input-inline" style="width: 140px;">
          <input id="txtEndDate" type="text" name="txtEndDate" class="layui-input" />
        </div>
      </div>
      <div class="layui-inline">
        <label class="layui-form-label">
          <img src="../images/过滤.png" height="14px;" alt="" />
          责任工区：
        </label>
        <div class="layui-input-inline" style="width: 140px;">
          <select name="ddlWorkcenter" lay-verify="required" id="ddlWorkcenter">
            <option value="全部">全部</option>
          </select>
        </div>
      </div>
      <div class="layui-inline">
        <div class="lable" style="background: #00ff00;">
          已完工
        </div>
      </div>
      <div class="layui-inline">
        <div class="lable" style="background: red; color: #fff;">
          超期未完工
        </div>
      </div>
      <div class="layui-inline">
        <div class="lable" style="background: #ffa500;">
          超期完工
        </div>
      </div>
      <div class="layui-inline">
        <div class="lable" style="background: #00bfff;">
          工序未排产
        </div>
      </div>
      <div class="layui-inline">
        <div class="lable" style="border: 1px solid #000;">
          <i class="layui-icon layui-icon-flag"></i>当前工序
        </div>
      </div>
      <div class="layui-inline">
        <div class="lable" style="border: 1px solid #000;">
          <i class="layui-icon layui-icon-rate-solid"></i>重点件号
        </div>
      </div>
    </div>
  </form>
  <div class="layui-fluid" style="padding-bottom: 0px;">
    <div class="layui-row layui-col-space5">
      <div class="layui-col-md12">
        <div id="paging">
        </div>
        <div id="foucusProductWrapper">
        </div>
      </div>
    </div>
  </div>
  <script type="text/javascript" src="../StaticFiles/layui/dist/layui.js"></script>
  <script type="text/javascript">
    $(function () {

      function getUrlParam(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
        var r = window.location.search.substr(1).match(reg);  //匹配目标参数
        if (r != null) return unescape(r[2]); return null; //返回参数值
      };

      var $factoryid = $("#ddlFactory").val();

      // 页面右上方时钟
      function showTime() {
        var currentTime = new Date();
        var year = currentTime.getFullYear();
        var month = currentTime.getMonth() + 1;
        var date = currentTime.getDate();
        var day = currentTime.getDay();
        var hours = currentTime.getHours();
        var minutes = currentTime.getMinutes();
        var seconds = currentTime.getSeconds();
        var time = document.getElementById("currentTime");
        if (seconds < 10) {
          seconds = "0" + seconds;
        }
        if (minutes < 10) {
          minutes = "0" + minutes;
        }
        time.innerHTML = year + "年" + month + "月" + date + "日   " + hours + " : " + minutes + " : " + seconds;
      };
      setInterval(showTime, 500);


      var now = new Date();
      var currentYear = now.getFullYear();
      var currentMonth = now.getMonth() + 1;
      var currentMonthLastDay = new Date(currentYear, currentMonth, 0).getDate();
      if (currentMonth < 10) {
        currentMonth = "0" + currentMonth;
      };

      var startDate = currentYear + "-" + currentMonth + "-" + "01";
      var endDate = currentYear + "-" + currentMonth + "-" + currentMonthLastDay;

      layui.use(['layer', 'table', 'laydate'], function () {
        var table = layui.table;
        var layer = layui.layer;
        var laypage = layui.laypage;
        var form = layui.form;
        var laydate = layui.laydate;
        var index = null;
        var limit = 6;

        form.on('select(ddlFactory)', function (data) {
          $("#header-title").text(data.elem[data.elem.selectedIndex].text + '--订单完成情况看板');
          BindWorkcenter(data.value);
        });

        //绑定时间
        laydate.render({
          elem: '#txtStartDate',
          type: 'date',
          trigger: 'click',
          lang: 'cn',
          calendar: false,
          theme: 'molv',
          range: false,
          value: startDate
        });

        laydate.render({
          elem: '#txtEndDate',
          type: 'date',
          trigger: 'click',
          lang: 'cn',
          calendar: false,
          theme: 'molv',
          range: false,
          value: endDate
        });

        //初始化分页控件
        function InitLayPage(total) {
          laypage.render({
            elem: 'paging'
            , count: total
            , limits: [limit]
            , limit: limit
            , layout: ['prev', 'page', 'next', 'limit', 'skip', 'count']
            , jump: function (obj, first) {
              if (!first) {
                GetContainerStepPlanData(obj.curr, limit);
              }
            }
          });
        }

        //查询总条数后初始化分页控件
        function GetTotal() {
          $.ajax({
            type: "POST",
            url: "../handler/board/MfgorderStatusInfo.ashx?type=GetTotal",
            data: {
              factoryid: $("#ddlFactory").val(),
              productname: $("#txtProductname").val(),
              containername: $("#txtContainername").val(),
              isFocusProductname: $("#ddlType").val(),
              status: $("#status").val(),
              //isMerge: $("#isMerge").val(),
              mfgordername: $("#txtMfgordername").val(),
              startDate: $("#txtStartDate").val() == "" ? startDate : $("#txtStartDate").val(),
              endDate: $("#txtEndDate").val() == "" ? endDate : $("#txtEndDate").val(),
              workcenterid: $("#ddlWorkcenter").val()
            },
            dataType: "text",
            cache: false,
            success: function (result) {
              var data = JSON.parse(result);
              InitLayPage(data.total);
            }
          });
        }
        GetTotal();

        //查询工区
        function BindWorkcenter(factoryid) {
          $.ajax({
            type: "POST",
            url: "../handler/board/MfgorderStatusInfo.ashx?type=GetWorkcentername",
            dataType: "text",
            data: { factoryid: factoryid || $factoryid },
            success: function (result) {
              var json = JSON.parse(result);
              $('#ddlWorkcenter').empty();
              $('#ddlWorkcenter').append("<option value='全部'>全部</option>");
              form.render("select");

              for (var i = 0; i < json.length; i++) {
                $('#ddlWorkcenter').append("<option value='" + json[i]["workcenterid"] + "'>" + json[i]["workcentername"] + "</option>");
              }
              form.render("select");
            }
          });
        };
        BindWorkcenter();

        //查询分厂名称
        $.ajax({
          type: "POST",
          url: "../handler/board/MfgorderStatusInfo.ashx?type=GetFactoryName",
          dataType: "text",
          data: { factoryid: $factoryid },
          success: function (result) {
            var data = JSON.parse(result);
            $("#header-title").text(data[0]["factoryname"] + "--订单完成情况看板");
            document.title = data[0]["factoryname"] + "订单完成情况看板";
          }
        });

        //生成html表格，参数maxSequence:工序数最大值
        function generateColum(maxSequence) {
          var tr = "<tr><td></td><td></td><td></td><td></td>";
          for (var i = 0; i < maxSequence; i++) {
            tr += "<td></td>";
          }
          tr += "</tr>";
          return tr;
        }

        function GetContainerStepPlanData(currentPage, pageSize) {
          $.ajax({
            type: "POST",
            url: "../handler/board/MfgorderStatusInfo.ashx?type=GetData",
            data: {
              currentPage: currentPage,
              pageSize: pageSize,
              factoryid: $("#ddlFactory").val(),
              productname: $("#txtProductname").val(),
              containername: $("#txtContainername").val(),
              isFocusProductname: $("#ddlType").val(),
              status: $("#status").val(),
              //isMerge: $("#isMerge").val(),
              mfgordername: $("#txtMfgordername").val(),
              startDate: $("#txtStartDate").val() == "" ? startDate : $("#txtStartDate").val(),
              endDate: $("#txtEndDate").val() == "" ? endDate : $("#txtEndDate").val(),
              workcenterid: $("#ddlWorkcenter").val()
            },
            dataType: "text",
            cache: false,
            beforeSend: function () {
              index = layer.load(0, { shade: [0.5, '#000'], time: 1000 * 1000, content: '加载中...' });
            },
            success: function (result) {
              layer.close(index);
              var data = JSON.parse(result);
              $("#foucusProductWrapper").empty();

              //工序数最大值
              var maxSequence = data.maxSequence;

              $("#foucusProductWrapper").css({ "width": (maxSequence + 4) * 150 + 'px' });

              var strTable = "<table class=\"layui-table\" id=\"content1\">";
              for (var i = 0; i < data.containerCount; i++) {
                strTable += generateColum(maxSequence);
                strTable += generateColum(maxSequence);
                strTable += generateColum(maxSequence);
              }

              strTable += "</table>";
              $("#foucusProductWrapper").append(strTable);

              var colsCount = $("#foucusProductWrapper table").find("tr").eq(0).find("td").length;

              var $table = $("#foucusProductWrapper table").eq(0);

              $table.find("tr").find("td:eq(0)").addClass("layui-table-fiexed").css({ overflow: 'none' });

              for (var i = 0; i < data.containerCount; i++) {
                // 从第5列开始循环绑值
                for (var j = 4; j < colsCount; j++) {
                  var reg = new RegExp("-", "g");

                  var plannedfinishdate = data.arr[(maxSequence * i) + (j - 4)].plannedfinishdate === null ? "未排产" : data.arr[(maxSequence * i) + (j - 4)].plannedfinishdate.split(' ')[0].replace(reg, '/');

                  var workflowstepname = data.arr[(maxSequence * i) + (j - 4)].workflowstepname === null ? "" : data.arr[(maxSequence * i) + (j - 4)].workflowstepname;

                  var fullname = data.arr[(maxSequence * i) + (j - 4)].fullname === null ? "" : data.arr[(maxSequence * i) + (j - 4)].fullname;

                  var status = data.arr[(maxSequence * i) + (j - 4)].status;

                  var td = $table.find("tr").eq(0 + (i * 3)).find("td").eq(j);

                  var workflowstepsequence = data.arr[(maxSequence * i) + (j - 4)].workflowstepsequence;
                  var sequence = data.arr[(maxSequence * i) + (j - 4)].sequence;

                  //iscurrentstep：是否为当前工序
                  var iscurrentstep = (data.arr[(maxSequence * i) + (j - 4)].workflowstepname !== null && workflowstepsequence === sequence) ? true : false;

                  switch (status) {
                    case "超期完成": td.css("backgroundColor", "#ffa500"); break;
                    case "按时完成": td.css("backgroundColor", "#00ff00"); break;
                    case "超期未完成": td.css({ "backgroundColor": "red", "color": "#fff" }); break;
                    case "工序未排产": td.css("backgroundColor", "#00BFFF"); break;
                    default: break;
                  };

                  if (workflowstepname == "完工入库") {
                    td.css("backgroundColor", "#00ff00");
                  }

                  if (data.arr[(maxSequence * i) + (j - 4)].checkdate !== null) {
                    plannedfinishdate += " ┋ " + data.arr[(maxSequence * i) + (j - 4)].checkdate.split(' ')[0];
                  } else {
                    if (workflowstepname !== "") {
                      plannedfinishdate += " ┋ " + "未完成";
                    } else {
                      plannedfinishdate = "";
                    }
                  };

                  //已完工但未排产，标记为绿色
                  if (status === "工序未排产" && data.arr[(maxSequence * i) + (j - 4)].checkdate !== null) {
                    td.css("backgroundColor", "#00ff00");
                  };

                  //绑定表格【工序名称】
                  if (iscurrentstep) {
                    if (workflowstepname !== "" && workflowstepname.length > 10) {
                      $table.find("tr").eq(0 + i * 3).find("td").eq(j)
                        .html("<i class='layui-icon layui-icon-flag'></i> " + workflowstepname.substring(0, 10) + "...")
                        .attr("title", workflowstepname)
                        .css({ "textDecoration": "underline" });
                    } else {
                      $table.find("tr").eq(0 + i * 3).find("td").eq(j).html("<i class='layui-icon layui-icon-flag'></i> " + workflowstepname);
                    }
                  } else {
                    if (workflowstepname !== "" && workflowstepname.length > 10) {
                      $table.find("tr").eq(0 + i * 3).find("td").eq(j)
                        .html("<i class='layui-icon layui-icon-tips'></i> " + workflowstepname.substring(0, 10) + "...")
                        .attr("title", workflowstepname);
                    } else {
                      $table.find("tr").eq(0 + i * 3).find("td").eq(j).html(workflowstepname);
                    }
                  }

                  //绑定表格【计划完成日期 | 实际完工日期】
                  if (plannedfinishdate !== " ┋ ") {
                    $table.find("tr").eq(1 + i * 3).find("td").eq(j).html(plannedfinishdate).css({ "font-size": "10" }); //计划完成日期 | 实际完工日期
                  }

                  //绑定表格【报工人】
                  if (fullname !== "" && fullname.length > 7) {
                    $table.find("tr").eq(2 + (i * 3)).find("td").eq(j)
                      .html("<i class='layui-icon layui-icon-user' style='font-weight:bold;'></i> " + fullname.substring(0, 7) + "...")
                      .attr("title", fullname);
                  } else {
                    $table.find("tr").eq(2 + (i * 3)).find("td").eq(j).html(fullname);
                  }

                  if (workflowstepname == "完工入库") {
                    $table.find("tr").eq(1 + i * 3).find("td").eq(j).text("");
                    $table.find("tr").eq(2 + (i * 3)).find("td").eq(j).text("");
                  }
                };

                //第1行内容
                //1.订单号
                $table.find("tr").eq(i * 3).find("td").eq(0)
                  .html("订单号：" + data.arr[maxSequence * i].mfgordername)
                  .css({ backgroundColor: "#e6e6e6", textAlign: "left", paddingLeft: "10px", color: "blue", marginLeft: "2px", "fontWeight": 'bold' });

                //2.批次号
                if (data.arr[maxSequence * i].producttype == "重点件号") {
                  if (data.arr[maxSequence * i].containername !== null && data.arr[maxSequence * i].containername.length > 20) {
                    $table.find("tr").eq(i * 3).find("td").eq(1)
                      .html("<i class='layui-icon layui-icon-rate-solid'></i> " + data.arr[maxSequence * i].containername.substring(0, 20) + "...")
                      .attr("title", "批次号：" + data.arr[maxSequence * i].containername + "，零件名称：" + data.arr[maxSequence * i].productdescription)
                      .css({ backgroundColor: "#e6e6e6", textAlign: "left", paddingLeft: "10px", color: "blue", marginLeft: "2px", "textDecoration": "underline" });
                  } else if (data.arr[maxSequence * i].containername !== null) {
                    $table.find("tr").eq(i * 3).find("td").eq(1)
                      .html("<i class='layui-icon layui-icon-rate-solid'></i> " + data.arr[maxSequence * i].containername)
                      .attr("title", "批次号：" + data.arr[maxSequence * i].containername + "，零件名称：" + data.arr[maxSequence * i].productdescription)
                      .css({ backgroundColor: "#e6e6e6", textAlign: "left", paddingLeft: "10px", color: "blue", marginLeft: "2px" });
                  } else {
                    $table.find("tr").eq(i * 3).find("td").eq(1)
                      .html("订单未创建批次")
                      .css({ backgroundColor: "#e6e6e6", textAlign: "left", paddingLeft: "10px", color: "blue", marginLeft: "2px" });
                  }
                } else {
                  if (data.arr[maxSequence * i].containername !== null && data.arr[maxSequence * i].containername.length > 20) {
                    $table.find("tr").eq(i * 3).find("td").eq(1)
                      .html(data.arr[maxSequence * i].containername.substring(0, 20) + "...")
                      .attr("title", "批次号：" + data.arr[maxSequence * i].containername + "，零件名称：" + data.arr[maxSequence * i].productdescription)
                      .css({ backgroundColor: "#e6e6e6", textAlign: "left", paddingLeft: "10px", color: "blue", marginLeft: "2px", "textDecoration": "underline" });
                  } else if (data.arr[maxSequence * i].containername !== null) {
                    $table.find("tr").eq(i * 3).find("td").eq(1)
                      .html(data.arr[maxSequence * i].containername)
                      .attr("title", "批次号：" + data.arr[maxSequence * i].containername + "，零件名称：" + data.arr[maxSequence * i].productdescription)
                      .css({ backgroundColor: "#e6e6e6", textAlign: "left", paddingLeft: "10px", color: "blue", marginLeft: "2px" });
                  } else {
                    $table.find("tr").eq(i * 3).find("td").eq(1)
                      .html("订单未创建批次")
                      .css({ backgroundColor: "#e6e6e6", textAlign: "left", paddingLeft: "10px", color: "blue", marginLeft: "2px" });
                  }
                }

                //3.当前工序
                if (data.arr[maxSequence * i].currentworkflowstepname !== null && data.arr[maxSequence * i].currentworkflowstepname.length > 10) {
                  $table.find("tr").eq(i * 3).find("td").eq(2)
                    .html("<i class='layui-icon layui-icon-flag'></i> " + data.arr[maxSequence * i].currentworkflowstepname.substring(0, 10) + "...")
                    .attr("title", "完整工序名称：" + data.arr[maxSequence * i].currentworkflowstepname)
                    .css({ textAlign: "left", paddingLeft: "10px", backgroundColor: "#e6e6e6", color: "blue", "textDecoration": "underline" });
                } else if (data.arr[maxSequence * i].currentworkflowstepname !== null) {
                  $table.find("tr").eq(i * 3).find("td").eq(2)
                    .html("<i class='layui-icon layui-icon-flag'></i> " + data.arr[maxSequence * i].currentworkflowstepname + "")
                    .css({ textAlign: "left", paddingLeft: "10px", backgroundColor: "#e6e6e6", color: "blue" });
                } else {
                  $table.find("tr").eq(i * 3).find("td").eq(2).html("").css({ backgroundColor: "#e6e6e6" });;
                }

                //第2行内容
                //1.计划开始日期
                $table.find("tr").eq(i * 3 + 1).find("td").eq(0)
                  .html("<i class='layui-icon layui-icon-date'></i> 计划开始：" + data.arr[maxSequence * i].plannedstartdate.split(' ')[0].replace(reg, '/') + "")
                  .css({ textAlign: "left", paddingLeft: "10px" });

                //2.开卡日期
                if (data.arr[maxSequence * i].originalstartdate !== null) {
                  $table.find("tr").eq(i * 3 + 1).find("td").eq(1)
                    .html("<i class='layui-icon layui-icon-date'></i> 开卡日期：" + data.arr[maxSequence * i].originalstartdate.split(' ')[0].replace(reg, '/') + "")
                    .css({ textAlign: "left", paddingLeft: "10px" });
                }

                //3.责任工区
                if (data.arr[maxSequence * i].fromworkcentername !== null) {
                  $table.find("tr").eq(i * 3 + 1).find("td").eq(2)
                    .html("<i class='layui-icon layui-icon-location'></i> 工区：" + data.arr[maxSequence * i].fromworkcentername)
                    .css({ textAlign: "left", paddingLeft: "10px" });
                } else {
                  $table.find("tr").eq(i * 3 + 1).find("td").eq(2).html("");
                }

                //第3行内容
                //1.计划完成
                $table.find("tr").eq(i * 3 + 2).find("td").eq(0)
                  .html("<i class='layui-icon layui-icon-date'></i> 计划完成：" + data.arr[maxSequence * i].plannedcompletiondate.split(' ')[0].replace(reg, '/') + "")
                  .css({ textAlign: "left", paddingLeft: "10px", "color": "blue", "fontWeight": "bold" });

                //2.到料日期
                if (data.arr[maxSequence * i].containername !== null) {
                  var materialdate = data.arr[maxSequence * i].materialdate == null ? "" : data.arr[maxSequence * i].materialdate.split(' ')[0].replace(reg, '/');
                  var isselfmfg = data.arr[maxSequence * i].isselfmfg;
                  if (isselfmfg === "不需领料") {
                    $table.find("tr").eq(i * 3 + 2).find("td").eq(1).html("不需领料").css({ textAlign: "left", paddingLeft: "10px" });
                  } else {
                    $table.find("tr").eq(i * 3 + 2).find("td").eq(1).html("<i class='layui-icon layui-icon-date'></i> 到料日期：" + materialdate + "").css({ textAlign: "left", paddingLeft: "10px" });
                  }
                } else {
                  $table.find("tr").eq(i * 3 + 2).find("td").eq(1).html("--");
                }

                //3.数量
                if (data.arr[maxSequence * i].qty !== null) {
                  $table.find("tr").eq(i * 3 + 2).find("td").eq(2)
                    .html("<i class='layui-icon layui-icon-tips'></i> 数量：" + data.arr[maxSequence * i].qty + "")
                    .css({ textAlign: "left", paddingLeft: "10px" });
                } else {
                  $table.find("tr").eq(i * 3 + 2).find("td").eq(2).html("");
                }


                $table.find("tr").eq(i * 3).find("td").eq(3).html("<i class='layui-icon layui-icon-tips'></i> 工序名称").css({ backgroundColor: "#e6e6e6", color: "blue" });
                $table.find("tr").eq(i * 3 + 1).find("td").eq(3).html("<i class='layui-icon layui-icon-date'></i> 时间节点");
                $table.find("tr").eq(i * 3 + 2).find("td").eq(3).html("<i class='layui-icon layui-icon-group'></i>报 工 人&nbsp;");

                $table.find("tr").eq(0).css({ borderTop: "2px solid #000" });
                $table.find("tr").eq(i * 3 + 2).css({ borderBottom: "2px solid #000" });
              }
            }
          });
        }
        GetContainerStepPlanData(1, limit);

        //查询按钮
        $("#btnSearch").click(function () {
          GetTotal();
          GetContainerStepPlanData(1, limit);
        });

        //重置
        $("#btnReset").click(function () {
          $("#txtProductname").val("");
          $("#txtContainername").val("");
          $("#ddlWorkcenter").find("option[value=" + "全部" + "]").prop("selected", true);
          $("#ddlType").find("option[value=" + "重点件号" + "]").prop("selected", true);
          $("#isMerge").find("option[value=" + "是" + "]").prop("selected", true);
          form.render();
          InitLayPage(0);
          $("#foucusProductWrapper").empty();
        });

      });
    });
  </script>
</body>

</html>